<template>
    <div class="jianzhuForm">
        <el-table
            ref="multipleTable"
            :data="dataSource"
            border
            tooltip-effect="dark"
            style="width: 100%"
            height="250"
            highlight-current-row
            @current-change="handleCurrentChange"
        >
            <el-table-column prop="AC_NAME" label="账户名称"> </el-table-column>
            <el-table-column prop="AC_TYPE" label="账户类型"> </el-table-column>
            <el-table-column prop="IS_PUBLIC" label="公共账户">
                <template slot-scope="scope">
                    {{ scope.row.IS_PUBLIC == '1' ? '是' : '否' }}
                </template>
            </el-table-column>
            <el-table-column prop="AC_STATE" label="账户状态">
                <template slot-scope="scope">
                    {{
                        scope.row.AC_STATE == '0'
                            ? '正常有效'
                            : scope.row.AC_STATE == '1'
                            ? '被销户'
                            : scope.row.AC_STATE == '2'
                            ? '被冻结'
                            : '被合并'
                    }}
                </template>
            </el-table-column>
        </el-table>
        <div class="radioList">
            <div class="top10">
                <label class="leftTitle">合并到：</label>
                <span class="name">
                    {{ currentRow.AC_NAME }}
                </span>
            </div>
            <div class="top10">
                <label class="leftTitle">结算时间：</label>
                <el-date-picker
                    disabled
                    v-model="initTime"
                    type="date"
                    placeholder="选择日期"
                    style="width: 160px; margin-right: 10px; float: left"
                >
                </el-date-picker>
                <el-checkbox v-model="checked" @change="changeCheck">实时结算</el-checkbox>
            </div>
            <div class="top10">
                <label class="leftTitle">合并原因：</label>
                <el-input type="textarea" v-model="desc" style="width: 600px; margin: 0; padding: 0"></el-input>
            </div>
        </div>
        <div style="text-align: right; margin-top: 10px">
            <el-button type="primary" @click="hbzh">合并账户</el-button>
            <el-button @click="cancel">取消</el-button>
        </div>
    </div>
</template>

<script>
import {AjaxCommon} from '@/libs/apiCommon'
import {PopupCommon} from '@/libs/popupCommon'
import moment from 'moment'
export default {
    components: {},
    props: ['selectUserList'],
    data() {
        return {
            // table 相关参数  begin
            currentRow: {},
            checked: true,
            desc: '',
            initTime: moment().format('YYYY-MM-DD'),
            dataSource: []
        }
    },
    watch: {
        selectUserList: {
            handler(user) {
                this.dataSource = user ?? []
            },
            immediate: true
        }
    },
    computed: {},
    created() {},
    mounted() {
        this.$nextTick(() => {})
    },
    methods: {
        hbzh() {
            if (typeof this.currentRow.AC_NAME == 'undefined' || this.currentRow.AC_NAME == '') {
                PopupCommon.notify('info', '请选择合并到哪个账户')
                return
            }
            if (typeof this.currentRow.desc == '') {
                PopupCommon.notify('info', '请填写合并原因')
                return
            }
            let self = this
            PopupCommon.confirm('确定要合并？')
                .then(() => {
                    const ids = self.dataSource?.map((t) => t.AC_GUID).toString()
                    AjaxCommon('/api/OpenAccount/MergeAccounts', 'post', {
                        ac_guids: ids,
                        mainAc: self.currentRow.AC_GUID,
                        newAcName: self.currentRow.AC_NAME,
                        initTime: self.checked ? 'RT' : moment().format('YYYY-MM-DD HH:mm:ss'),
                        desc: self.desc
                    })
                        .then((res) => {
                            if (res.data.status == 200) {
                                PopupCommon.notify('success', '合并成功')
                                self.$emit('success', '')
                            } else {
                                PopupCommon.notify('error', res.data.msg)
                            }
                        })
                        .catch((err) => {
                            PopupCommon.notify('error', err.message)
                        })
                })
                .catch(() => {
                    // 这里尽量写下，否则会报警告异常。
                    console.log('已取消重置')
                })
        },
        changeCheck(e) {
            if (e) {
                this.initTime = moment().format('YYYY-MM-DD')
            } else {
                this.initTime = null
            }
        },
        handleCurrentChange(val) {
            console.log(val, 'val....')

            this.currentRow = val
        },
        cancel() {
            this.$emit('close', '')
        }
    }
}
</script>

<style lang="scss" scoped>
.jianzhuForm {
    position: relative;
    top: -15px;
    .radioList {
        margin-top: 10px;
        padding-top: 10px;
        .name {
            font-weight: bold;
            font-size: 14px;
        }
        .top10 {
            margin-top: 10px;
            display: flex;
            line-height: 32px;
            .leftTitle {
                text-align: right;
                width: 90px;
                float: left;
            }
        }
    }
    .title {
        text-align: center;
        font-size: 18px;
        color: #000;
        padding-bottom: 10px;
        border-bottom: 1px solid #e0e0e0;
        margin-bottom: 10px;
    }
}
</style>
